<template>
  <div>
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="haSsearchQuery">
        <a-row :gutter="24">

          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="商品名称">
              <a-input placeholder="请输入商品名称" v-model="queryParam.productName"></a-input>
            </a-form-item>
          </a-col>

          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="SPU码">
              <a-input placeholder="请输入SPU码" v-model="queryParam.productNum"></a-input>
            </a-form-item>
          </a-col>

          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="ERP商品编号">
              <a-input placeholder="请输入ERP商品编号" v-model="queryParam.erpSale"></a-input>
            </a-form-item>
          </a-col>

          <template v-if="toggleSearchStatus">

            <a-col :xl="4" :lg="4" :md="4" :sm="24">
              <a-form-item>
                <j-dict-select-tag type="list" v-model="queryParam.isOnSale" dictCode="is_on_sale" placeholder="商品状态" />
              </a-form-item>
            </a-col>

            <a-col :xl="4" :lg="4" :md="4" :sm="24">
              <a-form-item>
                <j-dict-select-tag type="list" v-model="queryParam.specConfig" dictCode="spec_config" placeholder="规格类型" />
              </a-form-item>
            </a-col>

            <a-col :xl="4" :lg="4" :md="4" :sm="24">
              <a-form-item>
                <j-search-select-tag v-model="queryParam.brand" dict="product_brand,brand_zh_name,id,del_flag = '0'" placeholder="商品品牌"> </j-search-select-tag>
              </a-form-item>
            </a-col>

            <a-col :xl="10" :lg="11" :md="12" :sm="24">
              <a-form-item label="商品售价">
                <a-input placeholder="请输入最小值" class="query-group-cust" v-model="queryParam.salePriceBegin">
                </a-input>
                <span class="query-group-split-cust"></span>
                <a-input placeholder="请输入最大值" class="query-group-cust" v-model="queryParam.salePriceEnd">
                </a-input>
              </a-form-item>
            </a-col>

            <a-col :xl="4" :lg="4" :md="4" :sm="24">
              <a-form-item>
                <j-dict-select-tag type="list" v-model="queryParam.saleOrigin" dictCode="sale_origin" placeholder="商品来源" />
              </a-form-item>
            </a-col>
            <!-- <a-col :xl="10" :lg="11" :md="12" :sm="24">
                  <a-form-item label="可用库存">
                    <a-input placeholder="最小值" class="query-group-cust" v-model="queryParam.salePrice_begin">
                    </a-input>
                    <span class="query-group-split-cust"></span>
                    <a-input placeholder="最大值" class="query-group-cust" v-model="queryParam.salePrice_end"></a-input>
                  </a-form-item>
                </a-col> -->
            <a-col :xl="10" :lg="11" :md="12" :sm="24">
              <a-form-item label="更新时间">
                <a-range-picker @change="dateOnChange" v-model="updateTimeShow" />
              </a-form-item>
            </a-col>
          </template>

          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
              <a-button type="primary" @click="haSsearchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="haSsearchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
              </a>
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <a-table ref="table" size="middle" bordered rowKey="id" class="j-table-force-nowrap" :scroll="{ x: true }" :columns="columns" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" @change="handleTableChange">
      <div class="overflows" slot="introduction" slot-scope="value">
        <a-tooltip :title="value" placement="topLeft">
          {{ value }}
        </a-tooltip>
      </div>
      <div class="overflowStyle" slot="productName" slot-scope="text, record">
        <a-tooltip :title="record.productName" placement="topLeft">
          {{ record.productName }}
        </a-tooltip>
      </div>
      <template slot="isOnSale" slot-scope="text">
        <div v-html="text"></div>
      </template>
      <template slot="htmlSlot" slot-scope="text">
        <div v-html="text"></div>
      </template>
      <template slot="imgSlot" slot-scope="text">
        <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
        <img v-else @click="handlOpenepreviewVisible(text)" :src="getImgView(text)" style="width: 60px; height: 60px; font-size: 12px; font-style: italic" />
      </template>
      <template slot="bigImg" slot-scope="text">
        <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
        <img v-else @click="handlOpenepreviewVisible(text)" :src="getImgView(text)" style="width: 60px; height: 60px; font-size: 12px; font-style: italic" />
      </template>
      <template slot="fileSlot" slot-scope="text">
        <span v-if="!text" style="font-size: 12px; font-style: italic">无文件</span>
        <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="downloadFile(text)">
          下载
        </a-button>
      </template>

      <span slot="action" slot-scope="text, record">
        <a @click="handleEditinfo(record)">编辑</a>
        <a-divider type="vertical" />
        <a-dropdown>
          
          <a class="ant-dropdown-link">更多
            <a-icon type="down" />
          </a>
          <a-menu slot="overlay">
            <a-menu-item>
              <a @click="handleDetail(record)">详情</a>
            </a-menu-item>
            <a-menu-item>
              <a @click="handleUndercarriage(record.id, 'N')">停售</a>
            </a-menu-item>
            <a-menu-item>
              <a @click="handleUndercarriage(record.id, 'Y')">上架</a>
            </a-menu-item>
            <a-menu-item>
              <a @click="isDelete(record)">删除</a>
            </a-menu-item>
          </a-menu>
        </a-dropdown>
      </span>
    </a-table>
  </div>
</template>
<script>
export default {
  name: '',
  props: {
  },
  components: {},
  data() {
    return {};
  },
  computed: {},
  watch: {},
  created() {
  },
  mounted() {
  },
  methods: {
  },
};
</script>
<style scoped lang='less'>
</style>